new Vue({
    el: '#app',
    data: {
        msg: [{
                id: 1,
                cont: '吃饭',
                flag: false
            },
            {
                id: 2,
                cont: '睡觉',
                flag: false
            },
            {
                id: 3,
                cont: '打豪豪',
                flag: false
            }
        ],
        addDataFlag:false,
        addData:'',
        classifyFlag: false,
        type:'全部',
        removeFlag:false,
        classify:[
            {
                id: 1,
                text: '全部',
                style: 'danger'
            },
            {
                id: 2,
                text: '已完成',
                style: ''
            },
            {
                id: 3,
                text: '未完成',
                style: 'warning'
            }
        
        
        ]
    },
    methods:{
        addMsg(){
            let arr = [];
            for(var i = 0;i < this.msg.length;i++){
                arr.push(this.msg[i].id)
            }
            arr.sort((a,b)=> {return b-a})
            if(this.addData){
                this.msg.push({
                    id: arr[0]+1,
                    cont:this.addData,
                    flag: false
                })
            }
            
        },
        check(index){
            console.log()
            if(this.msg[index].flag){
                this.removeFlag = false
                this.remove(index)
            }else{
                this.removeFlag = true
            }
        },
        remove(index){
            this.msg.splice(index,1)
        }
    },
    computed:{
        finished(){
           return this.msg.filter(function(item){
                return item.flag ? item : false
           })
        },
        unfinished(){
            return this.msg.filter(function(item){
                return !item.flag ? item : false
           })
        },
        finishMsg(){
            switch(this.type){
                case "全部" :
                    return this.msg
                break;
                case "已完成" :
                    return this.finished
                break;
                case "未完成" :
                    return this.unfinished
                break;
            }
        }
    }
})